{extend name="Base" /}
{block name="title"}{$title}{/block}
{block name="header"}{:widget('Widget/nHeader')}{/block}
{block name="footer"}{:widget('Widget/nFooter')}{/block}
{block name="body"}
<div class="am-form am-u-lg-6 am-u-lg-centered am-u-md-6 am-u-md-centered am-u-sm-12 am-u-sm-centered" data-am-validator>
	<fieldset>
		<legend>登录</legend>
		<div class="am-form-group am-form-icon">
			<i class="am-icon-user am-icon-fw"></i>
			<input type="text" class="am-form-field" name="username" minlength="2" placeholder="输入帐号或邮箱" required/>
		</div>

		<div class="am-form-group am-form-icon">
			<i class="am-icon-lock am-icon-fw"></i>
			<input type="password" class="am-form-field" name="password" placeholder="请输入密码" pattern="^.{6,32}$" required/>
		</div>

		<div class="am-form-group am-form-icon">
			<i class="am-icon-shield am-icon-fw"></i>
			<input type="text" class="am-form-field" name="otp" placeholder="请输入两步验证动态验证码（非必要）" pattern="^.{6}$"/>
		</div>

		<input type="hidden" name="url" value="{$url}"/>

		{:token()}

		<button class="am-btn am-btn-secondary am-center submit" type="button" onclick="submit()">提交</button>
	</fieldset>
</div>


<div class="am-modal am-modal-alert" tabindex="-1" id="my-alert">
	<div class="am-modal-dialog">
		<div class="am-modal-hd">错误</div>
		<div class="am-modal-bd">登录失败</div>
		<div class="am-modal-footer">
			<span class="am-modal-btn" data-am-modal-confirm>知道了</span>
		</div>
	</div>
</div>

<script>
	function submit() {
		var data = {
			username: $("input[name=username]").val(),
			password: $("input[name=password]").val(),
			otp: $("input[name=otp]").val(),
			__token__: $("input[name=__token__]").val()
		};

		$.ajax({
			type: "POST",
			url: "/index/login/doLogin",
			cache: false,
			data: data,
			dataType: "json",
			success: function (data) {
				if (data.status === 0) {
					if (data.message) {
						$(".am-modal-bd").html(data.message);
					}
					$("#my-alert").modal({
						onConfirm: function () {
							location.href = "/index/login";
						}
					});
				} else if (data.status === 1) {
					var url = $("input[name=url]").val();
					if (url) {
						location.href = url;
					} else {
						location.href = "/";
					}
				} else if (data.status === 2) {
					$(".am-modal-bd").html(data.message);
					$("#my-alert").modal();
				} else {
					$(".am-modal-bd").html("系统故障，请稍候再试");
					$("#my-alert").modal();
				}
			}
		});
	}

	document.onkeydown = keyDownSearch;
	function keyDownSearch(e) {
		if (!e) e = window.event;
		if ((e.keyCode || e.which) === 13) {
			submit();
		}
	}
</script>
{/block}